<template>
	<view class="container">
		<titleBar :titleText='"万能转链"' :pageForm='"link"'></titleBar>
		<view style="padding: 0 32rpx;">
			<view class="feedbackConWrap">
				<textarea class="feedbackCon" placeholder="请在此粘贴你需要解析的数据，商品名称、淘口令、商品链接、分享的文案等，转化为自己的链接" placeholder-style="color:#999999" v-model="describe" />
			</view>
			<view class="zishu">您还能输入{{500-describe.length}}个字</view>
		</view>
		<view class="rowCenCen" @click="submit">
			<view class="tijiao">提交</view>
		</view>
      <u-popup v-model="showPopup" mode="center" :mask-close-able="false" border-radius="10">
          <view class="tishiWrap colCen">
            <view class="tishiTitle">提示</view>
            <view class="tishiCon">好家伙</view>
            <view class="tishiBtn">复制</view>
          </view>
        </u-popup>
      </view>
    </template>

    <script>
      import titleBar from '../../../components/backTitlebar.vue';
      import UPopup from "@/uview-ui/components/u-popup/u-popup.vue";
      export default {
        components:{
          UPopup,
          titleBar
        },
        data() {
          return {
            showPopup:false,
            showModel:'',
            describe: '',
            canClick:true
          };
        },
        onLoad(e) {
        },
        methods:{
          goBack(){
            uni.navigateBack();
          },


          submit(){
            if(this.canClick){
              if(this.describe){
                //this.canClick = false
                this.$http.post('union/api.tb/parseContent',{
                  content:this.describe
                },'application/json',true).then(res=>{

                    console.log(res)
                }).catch(res=>{
                  this.canClick = true
                })
              }else{
                uni.showToast({
                  title: '您还没有输入内容哦~',
                  icon: 'none',
                  position: 'bottom',
                  duration: 3000
                });
              }
            }
          },

        }
      }
    </script>

    <style>
      page{background: #EFF1F7;}
    </style>
    <style lang="scss" scoped>
      .container{
        .feedbackConWrap{background-color: #FFFFFF;border-radius: 20rpx;margin-top: 20rpx;
          .feedbackCon{width: 100%;height: 300rpx;padding: 20rpx 16rpx;font-size: 28rpx;}
        }
        .zishu{margin-top:24rpx;font-size: 28rpx;text-align: right;}
        .uploadWrap{background-color: #FFFFFF;border-radius: 20rpx;margin-top: 48rpx;padding: 20rpx 16rpx;
          .uploadTitle{font-size: 28rpx;margin-bottom: 30rpx;}
        }
        .tijiao{width: 686rpx;height: 90rpx;line-height: 90rpx;text-align: center;color: #FFFFFF;font-size: 32rpx;margin-top: 106rpx;
            background: linear-gradient(-77deg, #6141FE, #9F47FA);border-radius: 45rpx;}
        .tishiWrap{background-color: #FFFFFF;padding: 50rpx 40rpx 46rpx;width: 520rpx;
          .return{width: 17rpx;height: 32rpx;position: absolute;top: 50rpx;left: 40rpx;}
          .tishiTitle{font-size: 30rpx;}
          .tishiCon{font-size: 28rpx;margin: 30rpx 0 50rpx;}
          .tishiBtn{width: 200rpx;height: 60rpx;line-height: 52rpx;background: #FFFFFF;border: 2rpx solid #6A45DE;border-radius: 10rpx;font-size: 28rpx;text-align: center;color: #6A45DE;}
        }
      }
    </style>
